{include file="common/header"}
<div id="app" v-cloak>
	<div class="el-layout">
		<el-tabs tab-position="top">
		    <el-tab-pane label="基础配置">
			    <div class="el-pane-warp">
			        <el-form ref="ruleForm" :rules="rules" :model="config" label-width="150px">
			            <el-form-item label="产品每页数量：" prop="product_page">
                            <el-input type="number" v-model="config.product_page"></el-input>
                        </el-form-item>
			            <el-form-item label="新闻每页数量：" prop="news_page">
                            <el-input type="number" v-model="config.news_page"></el-input>
                        </el-form-item>
			            <el-form-item label="下载每页数量：" prop="download_page">
                            <el-input type="number" v-model="config.download_page"></el-input>
                        </el-form-item>
			            <el-form-item label="招聘每页数量：" prop="job_page">
                            <el-input type="number" v-model="config.job_page"></el-input>
                        </el-form-item>
			            <el-form-item label="门店每页数量：" prop="address_page">
                            <el-input type="number" v-model="config.address_page"></el-input>
                        </el-form-item>
			            <el-form-item label="团队每页数量：" prop="team_page">
                            <el-input type="number" v-model="config.team_page"></el-input>
                        </el-form-item>
                        <el-form-item label="产品参数设置：">
                            <el-parameter v-model="config.product_parameter"></el-parameter>
                        </el-form-item>
    			    </el-form>
    			    <div class="el-bottom" style="width: 100%">
                        <el-button 
                            :loading="loading"
                            type="primary" 
                            size="medium" 
                            icon="el-icon-refresh-right"
                            @click="save()">
                            保 存
                        </el-button>
                    </div>
    		    </div>
    		</el-tab-pane>
		    <el-tab-pane label="产品自定义字段">
			    <div class="el-pane-warp">
			        <el-form ref="ruleForm" :rules="rules" :model="config" label-width="0">
                        <el-form-item label="">
                            <el-field v-model="config.product_field" label-position="top"></el-field>
                        </el-form-item>
    			    </el-form>
    			    <div class="el-bottom" style="width: 100%">
                        <el-button 
                            :loading="loading"
                            type="primary" 
                            size="medium" 
                            icon="el-icon-refresh-right"
                            @click="save()">
                            保 存
                        </el-button>
                    </div>
    		    </div>
    		</el-tab-pane>
    		<el-tab-pane label="新闻自定义字段">
			    <div class="el-pane-warp">
			        <el-form ref="ruleForm" :rules="rules" :model="config" label-width="0">
                        <el-form-item label="">
                            <el-field v-model="config.news_field" label-position="top"></el-field>
                        </el-form-item>
    			    </el-form>
    			    <div class="el-bottom" style="width: 100%">
                        <el-button 
                            :loading="loading"
                            type="primary" 
                            size="medium" 
                            icon="el-icon-refresh-right"
                            @click="save()">
                            保 存
                        </el-button>
                    </div>
    		    </div>
    		</el-tab-pane> 
    		<el-tab-pane label="下载自定义字段">
			    <div class="el-pane-warp">
			        <el-form ref="ruleForm" :rules="rules" :model="config" label-width="0">
                        <el-form-item label="">
                            <el-field v-model="config.download_field" label-position="top"></el-field>
                        </el-form-item>
    			    </el-form>
    			    <div class="el-bottom" style="width: 100%">
                        <el-button 
                            :loading="loading"
                            type="primary" 
                            size="medium" 
                            icon="el-icon-refresh-right"
                            @click="save()">
                            保 存
                        </el-button>
                    </div>
    		    </div>
    		</el-tab-pane> 
    		<el-tab-pane label="招聘自定义字段">
			    <div class="el-pane-warp">
			        <el-form ref="ruleForm" :rules="rules" :model="config" label-width="0">
                        <el-form-item label="">
                            <el-field v-model="config.job_field" label-position="top"></el-field>
                        </el-form-item>
    			    </el-form>
    			    <div class="el-bottom" style="width: 100%">
                        <el-button 
                            :loading="loading"
                            type="primary" 
                            size="medium" 
                            icon="el-icon-refresh-right"
                            @click="save()">
                            保 存
                        </el-button>
                    </div>
    		    </div>
    		</el-tab-pane> 
    		<el-tab-pane label="门店自定义字段">
			    <div class="el-pane-warp">
			        <el-form ref="ruleForm" :rules="rules" :model="config" label-width="0">
                        <el-form-item label="">
                            <el-field v-model="config.address_field" label-position="top"></el-field>
                        </el-form-item>
    			    </el-form>
    			    <div class="el-bottom" style="width: 100%">
                        <el-button 
                            :loading="loading"
                            type="primary" 
                            size="medium" 
                            icon="el-icon-refresh-right"
                            @click="save()">
                            保 存
                        </el-button>
                    </div>
    		    </div>
    		</el-tab-pane> 
    		<el-tab-pane label="团队自定义字段">
			    <div class="el-pane-warp">
			        <el-form ref="ruleForm" :rules="rules" :model="config" label-width="0">
                        <el-form-item label="">
                            <el-field v-model="config.team_field" label-position="top"></el-field>
                        </el-form-item>
    			    </el-form>
    			    <div class="el-bottom" style="width: 100%">
                        <el-button 
                            :loading="loading"
                            type="primary" 
                            size="medium" 
                            icon="el-icon-refresh-right"
                            @click="save()">
                            保 存
                        </el-button>
                    </div>
    		    </div>
    		</el-tab-pane> 
		</el-tabs>
	</div>
</div>
<script>
new Vue({
    el: '#app',
    data() {
        return {
            config: {:json_encode($config)},
            loading: false,
            updateUrl: "cms/config/index",
            rules: {
                product_page: [
                    { required: true, message: '请填写', trigger: 'blur' },
                ],
                news_page: [
                    { required: true, message: '请填写', trigger: 'blur' },
                ],
                download_page: [
                    { required: true, message: '请填写', trigger: 'blur' },
                ],
                job_page: [
                    { required: true, message: '请填写', trigger: 'blur' },
                ],
                address_page: [
                    { required: true, message: '请填写', trigger: 'blur' },
                ],
                team_page: [
                    { required: true, message: '请填写', trigger: 'blur' },
                ],
            },
        }
    },
    methods: {
    	/**
         * 保存数据
         */
        save() {
        	let self = this;
            self.$refs.ruleForm.validate((valid) => {
                if (valid) {
                    self.loading = true;
                    request.post(self.updateUrl, {value: self.config}, function(res){
                        self.loading = false;
                        self.$notify({showClose: true, message: res.message, type: res.status});
                    });
                } else {
                    return false;
                }
            });
        },
    },
})
</script>
{include file="common/footer"}